<template>
<div class="date-time">
  <q-input filled v-model="date">
    <template v-slot:prepend>
      <q-icon name="event" class="cursor-pointer">
        <q-popup-proxy transition-show="scale" transition-hide="scale" v-model="dataShow">
          <q-date v-model="date" mask="YYYY-MM-DD HH:mm" />
        </q-popup-proxy>
      </q-icon>
    </template>

    <template v-slot:append>
      <q-icon name="access_time" class="cursor-pointer">
        <q-popup-proxy transition-show="scale" transition-hide="scale" v-model="timeShow">
          <q-time v-model="date" mask="YYYY-MM-DD HH:mm" format24h />
        </q-popup-proxy>
      </q-icon>
    </template>
  </q-input>
</div>
</template>

<script>
export default {
  name: 'date-time',
  data () {
    return {
      dataShow: false, // 日期选择框的显示与隐藏
      timeShow: false // 时间选择框的显示与隐藏
    }
  }
}
</script>

<style scoped lang="stylus">

</style>
